<template>
    <div style="height:100%;width:100%;">
        <bar class="bar" @on-back="$router.back()" title="单价"></bar>
        <group>
            <mu-input label="单价(元/升)" label-class="my-name" v-model="newValue" class="my-edit-name"></mu-input>
        </group>
        <div class="my-input">
            <x-button class="login-submit" @click.native="onSave">保存</x-button>
        </div>

        <input-control title="修改单价" @pwdDone="savePrice" :isShow.sync="isShow"></input-control>
        <confirm v-model="showForgetPwd" class="confirm-box" cancelText="忘记密码" confirmText="重试"
                 @on-cancel="$router.push('/passForget')" @on-confirm="onSave">
            <h4 class="confirm-title">输入密码错误</h4>
        </confirm>
    </div>
</template>

<script>
    import md5 from 'js-md5'
    import {mapState} from 'vuex'
    import {mapMutations} from 'vuex'
    import VUEX_NAME from '../../../store/constants.vue'
    import {
        lang
    } from 'muka'
    import {
        Bar,
        MInput,
        Mask,
        InputControl
    } from 'muka-ui'
    import {
        Group,
        XButton,
        Confirm
    } from 'vux'

    export default {
        name: 'editName',
        components: {
            Bar,
            'mu-input': MInput,
            Group,
            XButton,
            'mu-mask': Mask,
            InputControl,
            Confirm
        },
        created: function () {
            this.item = this.tankerList[this.$route.params.index]
            this.newValue = this.item.price
        },
        data: function () {
            return {
                isShow: false,
                showForgetPwd: false,
            }
        },
        computed: mapState([
            VUEX_NAME.tankerList
        ]),
        methods: {
            ...mapMutations([
                VUEX_NAME.uTanker
            ]),
            savePrice: async function (password) {
                this.$ajax(
                    'mch/editPrice',
                    {
                        tankerId: this.item.tankerId,
                        price: this.newValue,
                        payPwd: md5(password)
                    },
                    (content) => {
                        this.item.price = this.newValue
                        this.$router.back()
                    }, true, true)
            },
            onSave: function () {
                let reg = /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/
                if (!reg.test(this.newValue)) {
                    this.$vux.toast.show({
                        text: '金额不正确',
                        type: 'text',
                        position: 'middle'
                    })
                    return
                }
                if (this.newValue === this.item.price) {
                    this.$vux.toast.show({
                        text: '没有做任何更改',
                        type: 'text',
                        position: 'middle'
                    })
                    return
                }
                this.isShow = true
            }
        }
    }

</script>
